//#region Color

$--color-primary: #409eff !default;
$--color-white: #ffffff !default;
$--color-black: #000000 !default;

$--color-primary-light-1: mix(
  $--color-white,
  $--color-primary,
  10%
) !default; /* 53a8ff */
$--color-primary-light-2: mix(
  $--color-white,
  $--color-primary,
  20%
) !default; /* 66b1ff */
$--color-primary-light-3: mix(
  $--color-white,
  $--color-primary,
  30%
) !default; /* 79bbff */
$--color-primary-light-4: mix(
  $--color-white,
  $--color-primary,
  40%
) !default; /* 8cc5ff */
$--color-primary-light-5: mix(
  $--color-white,
  $--color-primary,
  50%
) !default; /* a0cfff */
$--color-primary-light-6: mix(
  $--color-white,
  $--color-primary,
  60%
) !default; /* b3d8ff */
$--color-primary-light-7: mix(
  $--color-white,
  $--color-primary,
  70%
) !default; /* c6e2ff */
$--color-primary-light-8: mix(
  $--color-white,
  $--color-primary,
  80%
) !default; /* d9ecff */
$--color-primary-light-9: mix(
  $--color-white,
  $--color-primary,
  90%
) !default; /* ecf5ff */

$--color-success: #80e050 !default;
$--color-warning: #ffbb55 !default;
$--color-danger: #ff5252 !default;
$--color-info: #909399 !default;
$--color-disabled: #bbbbbb !default;

$--color-success-light: mix($--color-white, $--color-success, 80%) !default;
$--color-warning-light: mix($--color-white, $--color-warning, 80%) !default;
$--color-danger-light: mix($--color-white, $--color-danger, 80%) !default;
$--color-info-light: mix($--color-white, $--color-info, 80%) !default;

$--color-success-lighter: mix($--color-white, $--color-success, 90%) !default;
$--color-warning-lighter: mix($--color-white, $--color-warning, 90%) !default;
$--color-danger-lighter: mix($--color-white, $--color-danger, 90%) !default;
$--color-info-lighter: mix($--color-white, $--color-info, 90%) !default;

$--color-text-primary: #303133 !default;
$--color-text-regular: #606266 !default;
$--color-text-secondary: #909399 !default;
$--color-text-placeholder: #c0c4cc !default;

$--border-color-base: #dcdcdc !default;
$--border-color-light: #e4e7ed !default;
$--border-color-lighter: #ebeef5 !default;
$--border-color-extra-light: #f2f6fc !default;

$--box-shadow-base: 0 2px 12px 0 rgba(0,0,0,.1);
//#endregion

//#region font-size
$--font-size-base: 14px !default;
$--font-size-medium: 14px !default;
$--font-size-small: 12px !default;
$--font-size-mini: 12px !default;
//#endregion

//#region z-index
$--zIndex-2: 2;
$--zIndex-5: 5;
$--zIndex-7: 7;
$--zIndex-10: 10;
$--zIndex-12: 12;
//#endregion

//#region Background
$--background-color-base: #f5f7fa !default;
//#endregion

//#region border
$--border-base: 1px solid $--border-color-base;
$--border-radius-base: 6px;
//#endregion

//#region //#endregion

/* components */

//#region Button
$--button-default-background-color: transparent !default;
$--button-default-font-color: $--color-text-primary !default;
$--button-default-border: 1px solid $--color-primary-light-8 !default;
// $--button-default-padding: 10px 12px !default;
// $--button-medium-padding: 8px 10px !default;
// $--button-small-padding: 6px 8px !default;
// $--button-mini-padding: 4px 6px !default;
//#endregion

//#region tag
$--tag-default-background-color: $--color-primary-light-9 !default;
$--tag-default-font-color: $--color-primary-light-3 !default;
$--tag-default-border: 1px solid $--color-primary-light-8 !default;
$--tag-close-font-color: $--color-primary !default;
//#endregion

//#region input
$--input-border-radius-base:$--border-radius-base /2 !default;
$--input-hover-border:1px solid $--color-text-placeholder !default;
$--icon-append-background-color: $--border-color-extra-light !default;
$--input-append-color-text: $--color-text-secondary !default;
$--input-icon-color-text: $--color-text-placeholder !default;
$--input-disabled-background-color: $--border-color-light !default;
//#endregion

//#region radio
// $--input-border-radius-base:$--border-radius-base /2 !default;
$--radio-button-default-background-color: transparent !default;
$--radio-button-default-font-color: $--color-text-primary !default;
$--radio-button-default-border: 1px solid $--color-primary-light-8 !default;
//#endregion

//#region select
// $--input-border-radius-base:$--border-radius-base /2 !default;
//#endregion

